
    let uu = document.querySelector(".cityInfo")
    let shop = document.querySelector(".shop")
    let place = document.querySelector(".place")
    let infoB = document.querySelector(".infoB")
    let productInfo = document.querySelector("#product>.info")
    console.log(infoB);



    /* 点击显示商铺选择 */
    shop.addEventListener("click", function (e) {
        $(infoB).toggleClass("hide")
        // 获取商铺列表
        reqshop()
        if (!$(infoB).hasClass("hide")) {
            // console.log($(shop).children("span").eq(1));
            $(shop).children("span").eq(1).html("▲")
        }
        else {
            $(shop).children("span").eq(1).html("▼")
        }
    })

    /* 点击显示地区选择 */
    place.addEventListener("click", function (e) {
        $(infoB).toggleClass("hide")
        reqarea()
        if (!$(infoB).hasClass("hide")) {
            console.log($(place).children("span").eq(1));
            $(place).children("span").eq(1).html("▲")
        }
        else {
            $(place).children("span").eq(1).html("▼")
        }
    })

    /* 获取商铺信息并渲染 */
    function reqshop() {
        fetch("http://chst.vip:1234/api/getgsshop")
            .then(response => response.json())
            .then(res => {
                let domStr = ''
                res.result.forEach(item => {
                    domStr += `
                    <li data-shopid=${item.shopId}>${item.shopName}</li>
                    `
                })
                infoB.innerHTML = domStr
            })
    }

    /* 获取地区信息 */
    function reqarea() {
        fetch("http://chst.vip:1234/api/getgsshoparea")
            .then(response => response.json())
            .then(res => {
                let domStr = ''
                res.result.forEach(item => {
                    domStr += `
                    <li data-areaid=${item.areaId}>${item.areaName}</li>
                    `
                })
                infoB.innerHTML = domStr
            })
    }

    /* 首次渲染 */
    request(0, 0)

    /* 获取数据 */
    function request(shopid = 0, areaid = 0) {
        fetch("http://chst.vip:1234/api/getgsproduct?shopid=" + shopid + "&areaid=" + areaid)
            .then(response => response.json())
            .then(res => {
                render(res.result, productInfo)
            })

    }



    // 渲染数据
    function render(data, container) {
        let domStr = ""
        data.forEach(item => {
            domStr += `
            <li>
                <a href="">
                    <img src=${item.productImg} alt="">
                    <div class="title">${item.productName}</div>
                    <p class="price">${item.productPrice}</p>
                </a>
            </li>
            `
        })
        container.innerHTML = domStr
    }


    select()
    /* 选择商城和地区获取数据并渲染 */
    function select() {
        let shopid;
        let areaid;
        infoB.addEventListener("click", function (e) {
            let _this = e.target;

            if (_this.localName === "li") {
                shopid = _this.getAttribute("data-shopid")
                areaid = _this.getAttribute("data-areaid")
                console.log(shopid);
                console.log(areaid);

                infoB.addEventListener("click", function (e) {
                    if (_this.localName === "li") {
                        if (shopid && !areaid) {
                            areaid = _this.getAttribute("data-areaid")
                            console.log(shopid);
                            console.log(areaid);
                            request(shopid, areaid)
                        }
                        if (!shopid && areaid) {
                            shopid = _this.getAttribute("data-shopid")
                            console.log(shopid);
                            console.log(areaid);
                            request(shopid, areaid)
                        }

                    }
                })


                // 如果 shopid 存在，areaid 为 null
                if (shopid && !areaid) {
                    if (!$(infoB).hasClass("hide")) {
                        $(infoB).addClass("hide")
                        $(shop).children("span").eq(1).html("▼")
                        $(shop).children().eq(0).html($(_this).html())
                    }
                    request(shopid, 0)
                } else if (!shopid && areaid) {
                    if (!$(infoB).hasClass("hide")) {
                        $(infoB).addClass("hide")
                        $(place).children("span").eq(1).html("▼")
                        let areaName = $(_this).html().split("（")[0]
                        $(place).children().eq(0).html(areaName)
                    }
                    request(0, areaid)
                }
            }



        })

    }